<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>限时秒杀</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/layer.css" />
    <link rel="stylesheet" type="text/css" href="../css/mdw.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../script/swiper.min.js"></script>
    <script type="text/javascript" src="../script/mobile.js"></script>
    <script type="text/javascript" src="../script/layer.js"></script>
    <script type="text/javascript" src="../script/mdw.js"></script>
    <script type="text/javascript" src="../script/jumpPage.js"></script>
</head>
<body>
    <header class="header miaoshaHeader">
        <div class="backPrevPage" onclick="historyBack()"></div>
        <div class="pageTitle">限时秒杀</div>
    </header>
    <section class="com_detailPage HTML_BOX">
       <ul class="miaoshaBox1">
            <!-- <li class="on">
                <div class="boxflex">
                    <span class="boxtitle1">正在秒杀</span>
                    <span class="time">12:00</span>
                </div>
            </li>
            <li>
               <div class="boxflex">
                    <span class="boxtitle2">即将开始</span>
                    <span class="time">12:00</span>
                </div>
            </li> -->
            <!-- <li>
                <div class="boxflex">
                    <span class="boxtitle2">3月16号</span>
                    <span class="time">12:00</span>
                </div>
            </li> -->
        </ul>
        <div class="plr miaoshaBox2">
            <div class="msdjs">距结束
                <span class="djstime hh">00</span>：
                <span class="djstime mm">00</span>：
                <span class="djstime ss">00</span>
            </div>
        </div>
        <ul class="wareList_1">
            
        </ul>
        
        <div class="pageHide dn">暂无数据..</div>
    </section>
    
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
    var page = 1;//页数
    var isload = true;
    var ifpage = true;
    apiready = function(){
        $api.fixStatusBar($api.dom('header'));
        api.setStatusBarStyle({
            color: '#fff',//设置APP状态栏背景色
            style: 'dark'
        });
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                 threshold: 10
            }
         }, function(ret, err) {
             //页码+1，继续请求数据
             
             if(ifpage){
                page++;
                warelist();
             }
             
        });
        ifCnAndEn();
        ready();
    };


    function ready(){
        var params = {
            page:page,//页数   
            limit:24
        }
        getAjax(Interface.spike_all_list,params,function(res){
            console.log(JSON.stringify(res));
            var spike = res.data.spike_list;
            var spike_future = res.data.spike_future;
            //console.log(JSON.stringify(spike));
            var miaosha = '';
            msid = spike.id;
            if(spike){
                var test = '正在秒杀';
                if(cnen==2){
                    test = 'Ongoing';
                }
                miaosha+='<li class="on"  onclick="goms(this,'+spike.id+')">';
                    miaosha+='<div class="boxflex">';
                        miaosha+='<span class="boxtitle1">'+test+'</span>';
                        miaosha+='<span class="time">'+timestampToTime2(spike.start_time)+'</span>';
                    miaosha+='</div>';
                miaosha+='</li>';
            }
            if(spike_future){
                $.each(spike_future,function(i,item){
                    var text = '正在秒杀';
                    if(i==0){
                       text = timestampToTime3(item.start_time);
                    }else{
                       text = timestampToTime3(item.start_time);
                    }
                    miaosha+='<li class="" onclick="goms(this,'+item.id+')">';
                        miaosha+='<div class="boxflex">';
                            miaosha+='<span class="boxtitle1">'+text+'</span>';
                            miaosha+='<span class="time">'+timestampToTime2(item.start_time)+'</span>';
                        miaosha+='</div>';
                    miaosha+='</li>';
                })
            }
            $(".miaoshaBox1").html(miaosha);
            if(isload){
                isload=false;
                pop_timeDown(spike.end_time);
            }
            warelist();
        });
    }

    function goms(e,id){
        $(".miaoshaBox1 li").removeClass("on");
        $(e).addClass("on");
        msid = id;
        page = 1;
        var ifpage = true;
        warelist();
    }

    function warelist(){
        var params = {
            id:msid,
            page:page,//页数   
            limit:24
        }
        getAjax(Interface.spike_product,params,function(res){
            console.log(JSON.stringify(res));
            var list = res.data;
            if(page==1){
                $(".wareList_1").empty();
            }
            if(list!="" && list !=null && list !=false){
                $(".pageHide").addClass("dn");ifpage=true;
                $.each(list,function(i,item){
                    var name = '';
                    if(cnen==1){
                        name = item.title;
                    }else{
                        name = item.egname;
                    }
                    var html = '<li onclick="goWare(\''+item.id+'\')">'+
                        '<div class="wareImgBox"><img src="'+getImg(item.icon)+'" /></div>'+
                        '<div class="wareName"><span>'+name+'</span></div><div class="warePrice">';
                        if(item.old_price == ""){
                                html+='<span>$'+item.spike_price+'</span>';
                            }else{
                                html+='<span>$'+item.spike_price+'</span>';
                                html+='<del>$'+item.old_price+'</del>';
                            }
                    html+='</div></li>';
                    $(".wareList_1").append(html);
                })
                if(list.length<10){
                    $(".getPage").hide();
                }
            }else{
                ifpage = false;
                if(page==1){$(".pageHide").removeClass("dn");}
            }
        });
    }
    $(".getPage").click(function(){
        page++;
        warelist();
    })
    
    var timer;
function pop_timeDown(timestamp){
        timer = setInterval(function(){
            //var nowTime = Date.parse( new Date() ).toString();
            var endTime = timestamp+"000";
            var nowTime = new Date();
 
            var t = endTime - nowTime.getTime()
            //var t = endTime - nowTime.substr(0,10);
            if(t <= 0){
                clearInterval(timer);
                $(".djstime.hh").html("00");
                $(".djstime.mm").html("00");
                $(".djstime.ss").html("00");
                return false;
            }
            var d=Math.floor(t/1000/60/60/24);
            var hour=Math.floor(t/1000/60/60%24);
            var min=Math.floor(t/1000/60%60);
            var sec=Math.floor(t/1000%60);
            if(d > 0){
             hour = Number(hour) + d*24;
            }
            if (hour < 10) {
                 hour = "0" + hour;
            }
            if (min < 10) {
                 min = "0" + min;
            }
            if (sec < 10) {
                 sec = "0" + sec;
            }
            $(".djstime.hh").html(hour);
            $(".djstime.mm").html(min);
            $(".djstime.ss").html(sec);
        },1000);
        pop.close();
        maskClose();
        $(".pop_Item").addClass("dn");
        maskOpen();
        $(".joinGroup_pop").removeClass("dn");
}

function timestampToTime2(timestamp) {
        //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var date = new Date(timestamp * 1000);
        Y = date.getFullYear() + '-';
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + ' ';
        h = (date.getHours() < 10 ? '0'+date.getHours() : date.getHours())+ ':';
        m = (date.getMinutes()< 10 ? '0'+date.getMinutes() : date.getMinutes()) ;
        s = date.getSeconds() < 10 ? '0'+date.getSeconds() : date.getSeconds();
        return h+m;
}
function timestampToTime3(timestamp) {
        //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var date = new Date(timestamp * 1000);
        
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '月';
        D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + '日';
        if(cnen==2){
            M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
            D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + '';
        }
        return M+D;
}
</script>
<script type="text/javascript">
    function ifCnAndEn(){
        if(cnen==2){
          $(".pageTitle").html("Flash Deals");
          $(".msdjs").html('End<span class="djstime hh">00</span>：<span class="djstime mm">00</span>：<span class="djstime ss">00</span>'); 
        }
    }
</script>
</html>